<template>
  <div>
    <Header></Header>
    <section>
      <Routers></Routers>
        <div class="main">
          <div>
            <div id="section">
              <ul class="list">
                <li @mouseover='zhishichanquanISshowBtn' @mouseout="zhishichanquanIShiddenBtn">
                  <div class="listIcon zhishichanquan"></div>
                  <div class="listContent">
                    <div class="listContent1">
                      <span class="fen zhishichanquan">{{zhishichanquan}}</span>
                      <span class="zongfen">总分：30</span>
                    </div>
                    <span class="title">知识产权</span>
                  </div>
                  <div v-if="zhishichanquanISshow" class="hiddenBox zhishichanquan_hiddenBox_list">
                    <ul class="hiddenBox_list">
                      <li class="hiddenBox_zhishichanquan" v-for="(item, index) in zhishichanquan_hiddenBox_list1">
                        <i class="inlineBlockIcon hiddenBox_zhishichanquan_icon">{{Array.isArray(item.value)?item.value[0]+'-'+item.value[1]:item.value}}</i>
                        <span class="hiddenBox_text">{{item.name}}</span>
                      </li>
                      <!--<li>-->
                        <!--<i class="inlineBlockIcon hiddenBox_zhishichanquan_icon">4</i>-->
                        <!--<span class="hiddenBox_text">对主要产品在技术上发挥核心支持作用</span>-->
                      <!--</li>-->
                    </ul>
                    <!--<ul class="hiddenBox_list ">-->
                      <!--<li class="hiddenBox_zhishichanquan" v-for="(item, index) in zhishichanquan_hiddenBox_list2">-->
                        <!--<i class="inlineBlockIcon hiddenBox_zhishichanquan_icon">{{Array.isArray(item.value)?item.value[0]+'-'+item.value[1]:item.value}}</i>-->
                        <!--<span class="hiddenBox_text">{{item.name}}</span>-->
                      <!--</li>-->
                      <!--<li>-->
                        <!--<i class="inlineBlockIcon hiddenBox_zhishichanquan_icon">4</i>-->
                        <!--<span class="hiddenBox_text">知识产权数量</span>-->
                      <!--</li>-->
                      <!--<li>-->
                        <!--<i class="inlineBlockIcon hiddenBox_zhishichanquan_icon">2</i>-->
                        <!--<span class="hiddenBox_text">知识产权获得方式</span>-->
                      <!--</li>-->
                    <!--</ul>-->
                  </div>
                </li>
                <li>
                  <div class="listIcon kejichengguo"></div>
                  <div class="listContent">
                    <div class="listContent1">
                      <span class="fen kejichengguo">{{kejichengguo}}</span>
                      <span class="zongfen">总分：30</span>
                    </div>
                    <span class="title">科技成果转化能力</span>
                  </div>
                </li>
                <li class="qiyechengzhang_box" @mouseover='qiyechengzhangISshowBtn' @mouseout="qiyechengzhangIShiddenBtn">
                  <div class="listIcon qiyechengzhang"></div>
                  <div class="listContent">
                    <div class="listContent1">
                      <span class="fen qiyechengzhang">{{qiyechengzhang}}</span>
                      <span class="zongfen">总分：20</span>
                    </div>
                    <span class="title">企业成长性</span>
                  </div>
                  <div v-if="qiyechengzhangISshow" class="hiddenBox qiyechengzhang_hiddenBox_list">
                    <ul class="hiddenBox_list ">
                      <li class="hiddenBox_zhishichanquan" v-for="(item,index) in qiyechengzhang_hiddenBox_list1">
                        <i class="inlineBlockIcon hiddenBox_qiyechengzhang_icon">{{Array.isArray(item.value)?item.value[0]+'-'+item.value[1]:item.value}}</i>
                        <span class="hiddenBox_text">{{item.name}}</span>
                      </li>
                      <!--<li>-->
                        <!--<i class="inlineBlockIcon hiddenBox_qiyechengzhang_icon">23%</i>-->
                        <!--<span class="hiddenBox_text">净资产增长率</span>-->
                      <!--</li>-->
                      <!--<li>-->
                        <!--<i class="inlineBlockIcon hiddenBox_qiyechengzhang_icon">9</i>-->
                        <!--<span class="hiddenBox_text">得分</span>-->
                      <!--</li>-->
                    </ul>
                    <ul class="hiddenBox_list ">
                      <li class="hiddenBox_zhishichanquan" v-for="(item,index) in qiyechengzhang_hiddenBox_list2">
                        <i class="inlineBlockIcon hiddenBox_qiyechengzhang_icon">{{Array.isArray(item.value)?item.value[0]+'-'+item.value[1]:item.value}}</i>
                        <span class="hiddenBox_text">{{item.name}}</span>
                      </li>
                      <!--<li>-->
                        <!--<i class="inlineBlockIcon hiddenBox_qiyechengzhang_icon">2017</i>-->
                        <!--<span class="hiddenBox_text">当前年度</span>-->
                      <!--</li>-->
                      <!--<li>-->
                        <!--<i class="inlineBlockIcon hiddenBox_qiyechengzhang_icon">23%</i>-->
                        <!--<span class="hiddenBox_text">销售收入增长率</span>-->
                      <!--</li>-->
                      <!--<li>-->
                        <!--<i class="inlineBlockIcon hiddenBox_qiyechengzhang_icon">9</i>-->
                        <!--<span class="hiddenBox_text">得分</span>-->
                      <!--</li>-->
                    </ul>
                  </div>
                </li>
                <li>
                  <div class="listIcon yanjiukaifa"></div>
                  <div class="listContent">
                    <div class="listContent1">
                      <span class="fen yanjiukaifa">{{yanjiukaifa}}</span>
                      <span class="zongfen">总分：20</span>
                    </div>
                    <span class="title">研究开发组织管理水平</span>
                  </div>
                </li>
              </ul>
              <div class="allScore_box">
                <p class="allScore_top">
                  <span class="allScore_top_title">总分</span>
                  <span class="allScore_top_time">{{tijiaoTimer}}提交</span>
                </p>
                <div class="allScore_center_box1">
                  <div class='allScore_icon'></div>
                  <div class="allScore_center_box1_text">
                    <span class="allScore_num">{{allScore}}</span>
                    <span class="allScore_txt">总分：100</span>
                  </div>
                </div>
                <div id="btnBOX">
                  <div class="getAllScoreBtn" v-if="show==1||show==3||show==4" @click="getNEW">获取平台优化评分</div>
                  <div class="getAllScoreBtn" v-if="show==5"  @click="getSubmit">提交审核</div>
                  <div class="getAllScoreBtn_gary" v-if="show==2">审核中</div>
                  <div class="getAllScoreBtn" v-if="show==3" @click="getScore">获取具体分数</div>
                  <a class="getAllScoreBtn" v-if="show==4" href="http://fys.youledi.cn/index/export_zips" target="_blank">导出文件</a>
                </div>
              </div>
            </div>
            <!--<div class="evaluate_box">-->
              <!--<p class="evaluate_title">评价</p>-->
              <!--<div class="evaluate_text_box">-->
                <!--<p class="evaluate_text" v-for="item in evaluate">{{item}}</p>-->
              <!--</div>-->
            <!--</div>-->
          </div>
          <!--tankuang -->
          <div class="tankuang_box" v-if="tankuangISshow">
            <div class="tankuang">
              <p class="tankuangMSG">{{tankuangMSG}}</p>
              <button class="tankuang_ok_btn" @click="tankuangISshowBTN">确认</button>
            </div>
          </div>
        </div>
    </section>
  </div>
</template>

<script>
  import Routers from '@/template/routers.vue'
  import Header from '@/template/common_header.vue'
  export default {
    name: 'index1',
    components: {
      Routers,
      Header
    },
    data () {
      return {
        show:1,
        zhishichanquan:0,
        zhishichanquanISshow:false,
        kejichengguo:0,
        qiyechengzhang:0,
        qiyechengzhangISshow:false,
        yanjiukaifa:0,
        tijiaoTimer:'2018-5-31',
        allScore:0,
        evaluate:[
          '1、知识产权共计5项，每项最低1分，最高3分，综合得分10，满分30。',
          '2、科技成果转化能力共计5项，根据专家评估，综合得分22，满分30。',
          '3、企业成长性，根据提供的数据计算净资产增长率为25%，销售收入增长率30%，综合得分19，满分20。',
          '4、研究开发组织管理水平，共提交6分资料，根据专家评估，综合得分13，满分20。',
          '5、总分64，科技成果转化能力、企业成长性、研究开发管理水平方面较好，知识产权方面较为欠缺，暂时不能申报高新技术企业，请完善相关资料。'
        ],
        tankuangMSG:'tankuangMSG',
        tankuangISshow:false,
        zhishichanquan_hiddenBox_list1:[],
//        zhishichanquan_hiddenBox_list2:[],
        qiyechengzhang_hiddenBox_list1:[],
        qiyechengzhang_hiddenBox_list2:[],
      }
    },
    mounted: function() {
      this.axios.get('/index/show_score').then((res)=>{
        if(res.data.code==1){
          let status = res.data.data.status
          if(status==1){
            this.show = 1
          }else if(status==2){
            this.show = 2
          }else if(status==3){
            this.show = 3
          }else if(status==4){
            this.show = 4
          }
          let know = res.data.data.know
          let tec = res.data.data.tec
          let grow = res.data.data.grow
          this.yanjiukaifa = res.data.data.res
          this.tijiaoTimer = res.data.data.time
          if(status==4){
            this.allScore = res.data.data.total
            this.zhishichanquan = know.total
            this.kejichengguo = tec
            this.qiyechengzhang = grow.total
          }else{
            this.allScore = res.data.data.total[0]+'-'+res.data.data.total[1]
            this.zhishichanquan = know.total[0]+'-'+know.total[1]
            this.kejichengguo = tec[0]+'-'+tec[1]
            this.qiyechengzhang = grow.total[0]+'-'+grow.total[1]
          }
          this.zhishichanquan_hiddenBox_list1 = know.detail
//          this.zhishichanquan_hiddenBox_list2 = know.detail[1]
          this.qiyechengzhang_hiddenBox_list1 = grow.detail[0]
          this.qiyechengzhang_hiddenBox_list2 = grow.detail[1]
        }
      })
    },
    methods: {
      /*获取分数*/
      getNEW (){
        this.axios.post('/index/save_score').then((res)=>{
          if(res.data.code==1){
            this.show = 5
            let status = res.data.data.status
            let know = res.data.data.know
            let tec = res.data.data.tec
            let grow = res.data.data.grow
            this.yanjiukaifa = res.data.data.res
            this.tijiaoTimer = res.data.data.time
            this.allScore = res.data.data.total[0]+'-'+res.data.data.total[1]
            this.zhishichanquan = know.total[0]+'-'+know.total[1]
            this.kejichengguo = tec[0]+'-'+tec[1]
            this.qiyechengzhang = grow.total[0]+'-'+grow.total[1]
            this.zhishichanquan_hiddenBox_list1 = know.detail
            this.qiyechengzhang_hiddenBox_list1 = grow.detail[0]
            this.qiyechengzhang_hiddenBox_list2 = grow.detail[1]
          }else{
            this.tankuangISshow = true
            this.tankuangMSG = res.data.msg
          }
        })
      },
      getSubmit(){
        this.axios.post('/index/submit_check').then((res)=>{
          if(res.data.code==1){
            this.show=2
          }
        })
      },
      getScore(){
        this.axios.post('/index/save_dscore').then((res)=>{
          if(res.data.code==1){
            this.show = 4
            let status = res.data.data.status
            let know = res.data.data.know
            let tec = res.data.data.tec
            let grow = res.data.data.grow
            this.yanjiukaifa = res.data.data.res
            this.tijiaoTimer = res.data.data.time
            this.allScore = res.data.data.total
            this.zhishichanquan = know.total
            this.kejichengguo = tec
            this.qiyechengzhang = grow.total
            this.zhishichanquan_hiddenBox_list1 = know.detail
            this.qiyechengzhang_hiddenBox_list1 = grow.detail[0]
            this.qiyechengzhang_hiddenBox_list2 = grow.detail[1]
          }
        })
      },
      importFiles(){

      },
      /********/
      zhishichanquanISshowBtn () {
        this.zhishichanquanISshow = !this.zhishichanquanISshow
      },
      zhishichanquanIShiddenBtn () {
        this.zhishichanquanISshow = !this.zhishichanquanISshow
      },
      qiyechengzhangISshowBtn (){
        this.qiyechengzhangISshow = !this.qiyechengzhangISshow
      },
      qiyechengzhangIShiddenBtn () {
        this.qiyechengzhangISshow = !this.qiyechengzhangISshow
      },
      tankuangISshowBTN () {
        this.tankuangISshow = !this.tankuangISshow
      }
    }
  }
</script>

<style scoped>
  @import '../../assets/public.css';
  .main{
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  #section{
    /*padding-top:57px;*/
    display: flex;
    align-items: center;
    text-align: center;
    flex-wrap: wrap;
    justify-content: center;

  }
  ul.list{
    padding-top:57px;
    width:824px;
    height:428px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
  }
  ul.list>li{
    width: 396px;
    height: 199px;
    border:1px solid #f1f1f1;
    border-radius: 2px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    position:relative;
  }
  /*隐藏的盒子*/
  ul.list>li>.hiddenBox{
    position: absolute;
    right:-473px;
    top:0;
    width:466px;
    height:356px;
    border: 1px solid #ddd;
    box-shadow: 2px 2px 5px #e6e6e6;
    z-index: 5;
    background: #fff;
  }
  .hiddenBox_zhishichanquan_icon{
    width:57px;
    height:57px;
    background-image: url("img/zhishichanquan_yuan.png");
    color: #f9b77c;
    font-size:24px;
    text-align: center;
    line-height: 57px;
    box-sizing: border-box;
    margin-bottom:27px;
  }
  .hiddenBox_qiyechengzhang_icon{
    width:57px;
    height:57px;
    background-image: url("img/qiyechengzhang_yuan.png");
    color: #CAA2D8;
    font-size:20px;
    text-align: center;
    line-height: 57px;
    box-sizing: border-box;
    margin-bottom:27px;
  }
  .hiddenBox>ul.hiddenBox_list{
    display: flex;
    align-items: flex-start;
    justify-content: center;
  }
  .hiddenBox>ul.hiddenBox_list:last-child{
    margin-top:10px;
  }
  div.zhishichanquan_hiddenBox_list{
    padding:50px 60px 0 60px;
    box-sizing: border-box;
  }
  div.zhishichanquan_hiddenBox_list ul{
    flex-wrap: wrap;
  }
  div.zhishichanquan_hiddenBox_list li.hiddenBox_zhishichanquan{
    width:50%!important;
    /*flex:0;*/
  }
  div.qiyechengzhang_hiddenBox_list{
    padding:32px 40px 0 40px;
    box-sizing: border-box;
    height:296px!important;
  }
  .hiddenBox>ul.hiddenBox_list>li{
    display: flex;
    flex-direction: column;
    align-items: center;
    /*flex:1;*/
  }
  div.qiyechengzhang_hiddenBox_list li{
    flex:1;
  }
  .hiddenBox_text{
    color: #333;
    font-size:19px;
  }
  .qiyechengzhang_box:hover>div.hiddenBox{
    display: block;
  }
  /************/
  ul.list>li:nth-child(odd){
    margin-right:32px;
  }
  ul.list>li:nth-child(1),ul.list>li:nth-child(2){
    margin-bottom:30px;
  }
  div.listContent{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }
  div.listContent>div.listContent1{
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .listIcon{
    width:80px;
    height:80px;
    margin-right:19px;
    margin-left:37px;
  }
  span.fen{
    font-size:33px;
  }
  span.zongfen{
    font-size:20px;
    color: #AAAAAA;
  }
  span.title{
    color: #888;
    font-size:24px;
  }
  /*那四个不一样的*/
  div.zhishichanquan{
    background-image: url("img/zhishichanquan.png");
  }
  span.zhishichanquan{
    color: #F3AA7D;
  }
  div.kejichengguo{
    background-image: url("img/kejichengguo.png");
  }
  span.kejichengguo{
    color: #F679A0;
  }
  div.qiyechengzhang{
    background-image: url("img/qiyechengzhang.png");
  }
  span.qiyechengzhang{
    color: #A088DB;
  }
  div.yanjiukaifa{
    background-image: url("img/yanjiukaifa.png");
  }
  span.yanjiukaifa{
    color: #71BD72;
  }
  /*总分*/
  .allScore_box{
    margin-top:57px;
    width:400px;
    height: 428px;
    border: 1px solid #f1f1f1;
    border-radius: 2px;
    box-sizing: border-box;
    padding:32px 30px 0 47px;
    margin-left:30px;
  }
  p.allScore_top{
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .allScore_top_title{
    color:#333;
    font-size:24px;
  }
  .allScore_top_time{
    color:#888;
    font-size:20px;
  }
  div.allScore_icon{
    width:84px;
    height:84px;
    background-image: url("img/zongfen.png");
    margin-right:83px;
  }
  span.allScore_num{
    color: #55ABED;
    font-size:33px;
  }
  span.allScore_txt{
    color: #666;
    font-size:21px;
  }
  div.allScore_center_box1{
    display: flex;
    align-items: center;
    margin-top:90px;
    margin-bottom:85px;
  }
  div.allScore_center_box1_text{
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  #btnBOX{
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .getAllScoreBtn{
    /*width:200px;*/
    /*height:50px;*/
    padding:0 20px;
    margin:0 auto;
    color: #13A0E6;
    border: 1px solid #13A0E6;
    border-radius: 25px;
    text-align: center;
    line-height: 50px;
    box-sizing: border-box;
    cursor: pointer;
  }
  .getAllScoreBtn_gary{
    padding:0 20px;
    margin:0 auto;
    color: #666;
    border: 1px solid #666;
    border-radius: 25px;
    text-align: center;
    line-height: 50px;
    box-sizing: border-box;
    /*cursor: pointer;*/
  }
  /*评价*/
  div.evaluate_box{
    border: 1px solid #f1f1f1;
    border-radius: 2px;
    height:289px;
    margin-top:30px;
  }
  p.evaluate_title{
    color: #333;
    font-size:20px;
    line-height: 66px;
    padding-left:28px;
    border-bottom:1px solid #f1f1f1;
    margin:0;
  }
  p.evaluate_text{
    color: #888;
    font-size: 12px;
    line-height: 25px;
  }
  div.evaluate_text_box{
    text-align: left;
    padding-left:28px;
    padding-top:30px;
  }
</style>
